<template>
	<view class="page">
		//英雄区（滑动图片，焦点图片位置）
		//interval自动切换间隔时间
		//duration滑动图片时间长度
		<swiper  class="swiper" circular="true" interval="8000" duration="1000">
			<swiper-item>
				<image mode="widthFix" src="https://emos-wx-1304955331.cos.ap-guangzhou.myqcloud.com/img/banner/swiper-1.jpg"></image>
			</swiper-item>
			<swiper-item>
				<image mode="widthFix" src="https://emos-wx-1304955331.cos.ap-guangzhou.myqcloud.com/img/banner/swiper-2.jpg"></image>
			</swiper-item>		
			<swiper-item>
				<image mode="widthFix" src="https://emos-wx-1304955331.cos.ap-guangzhou.myqcloud.com/img/banner/swiper-3.jpg"></image>
			</swiper-item>		
			<swiper-item>
				<image mode="widthFix" src="https://emos-wx-1304955331.cos.ap-guangzhou.myqcloud.com/img/banner/swiper-4jpg"></image>
			</swiper-item>		
			<swiper-item>
				<image mode="widthFix" src="https://emos-wx-1304955331.cos.ap-guangzhou.myqcloud.com/img/banner/swiper-5.jpg"></image>
			</swiper-item>		
		</swiper>
		
		//消息提醒
		<view class="notify-container" >
			//第一行
			<view class="notify-title">
				<image src="../../static/icon-1.png" mode="widthFix" class="notify-icon"></image>
				消息提醒
			</view>
			<view class="notify-content">
				你有{{ unreadRows }}条未读消息（DesignBy:骆发茂）
			</view>
			<image src="../../static/icon-2.png" mode="widthFix" class="more-icon"></image>
			
		</view>


			//栏目导航
			<view class="nav-container">
				<view class="nav-row">
					<view class="nav" @tap="toPage('在线签到','。。/checkin/checkin')">
						<image mode="widthFix" src="../../static/nav-1.png" class="icon"></image>
						<text class="name">在线签到</text>
					</view>
					<view class="nav">
						<image src="../../static/nav-2.png" mode="widthFix" class="icon"></image>
						<text class="name">员工健康</text>
					</view>
					<view class="nav">
						<image src="../../static/nav-3.png" mode="widthFix" class="icon"></image>
						<text class="name">在线请假</text>
					</view>
					<view class="nav">
						<image src="../../static/nav-4.png" mode="widthFix" class="icon"></image>
						<text class="name">公务出差</text>
					</view>
				</view>
				<view class="nav-row">
					<view class="nav">
						<image src="../../static/nav-5.png" mode="widthFix" class="icon"></image>
						<text class="name">员工日报</text>
					</view>
					<view class="nav">
						<image src="../../static/nav-6.png" mode="widthFix" class="icon"></image>
						<text class="name">我的加班</text>
					</view>
					<view class="nav">
						<image src="../../static/nav-7.png" mode="widthFix" class="icon"></image>
						<text class="name">付款申请</text>
					</view>
					<view class="nav">
						<image src="../../static/nav-8.png" mode="widthFix" class="icon"></image>
						<text class="name">费用报销</text>
					</view>
				</view>
				<view class="nav-row">
					<view class="nav">
						<image src="../../static/nav-9.png" mode="widthFix" class="icon"></image>
						<text class="name">公告通知</text>
					</view>
					<view class="nav">
						<image src="../../static/nav-10.png" mode="widthFix" class="icon"></image>
						<text class="name">在线审批</text>
					</view>
					<view class="nav">
						<image src="../../static/nav-11.png" mode="widthFix" class="icon"></image>
						<text class="name">物品领用</text>
					</view>
					<view class="nav">
						<image src="../../static/nav-12.png" mode="widthFix" class="icon"></image>
						<text class="name">采购申请</text>
					</view>
				</view>
			</view>
			
	</view>
</template>

<script>
	export default {
		data() {
			return {
			unreadRows:0
			}
		},
		onLoad() {

		},
		methods: {
			toPage:function(name,url)
			{
				uni.navigateTo({
					url:url
				})
			}
		}
	}
</script>

<style lang="less">
	@import url("index.less");
</style>
